<template>
  <div class="dashboard-container">
    <el-row :gutter="20">
      <el-col :span="12">
        <el-card>
          <workCalendar></workCalendar>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card>
          <el-button @click="changLang">切换语言</el-button>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
// 导入 cookie
import cookie from 'js-cookie'
export default {
  name: 'Dashboard',
  components: {
    workCalendar: () => import('./components/work-calendar.vue')
  },
  methods: {
    changLang () {
      // 切换语言
      this.$i18n.locale === 'zh'
        ? (this.$i18n.locale = 'en')
        : (this.$i18n.locale = 'zh')
      // 将语言状态存储到 cookie 中
      cookie.set('locale', this.$i18n.locale)
      // 刷新页面
      this.$router.go(0)
    }
  }
}
</script>

<style lang="scss" scoped>
.dashboard-container {
  padding: 20px;
}
</style>
